webdd

Web Design and Development

Below is information that will assist you in the design and development of web sites.

1. Web Style Guide
2. Sites about Web Design
3. The Web Design Competency Worksheet
4. CSS Templates
5. Online Web Development Course
6. Jim Thatcher on Accessibility of Web Sites
7. CSS and HTML Tutorials on YouTube
8. KompoZer Tutorials
9. Window titles in Dreamweaver

---

1. Web Style Guide <- Read this! We will be using ideas from this document in our reports.

---

2. Some Other Good Sites about Web Design:

• Web Design from Scratch
  
• Accessible Web Page Design
  
• Web Design References
  
• HTML Goodies
  

---

3. **Web Site Check List** [revised 9/25/15]

---

4. You may use a CSS template if you wish for the web activities, but it is not required:

• Free Templates: http://www.freecsstemplates.org/
• Open Source Templates: http://www.oswt.co.uk/
• Arcsin: http://templates.arcsin.se/
• Andreas Viklund: http://andreasviklund.com/templates/
• StyleShout Free Templates: http://www.styleshout.com/free-templates.php
• FREE CSS template: http://www.free-css-templates.com/

---

5. Here is a complete course online about web development designed for high school students:
http://www.washington.edu/accesscomputing/webd2/student/

• Unit One: Designing and Planning Web Pages
• Unit Two: Creating Web Pages with HTML
• Unit Three: Formatting Web Pages with Style Sheets (CSS)
• Unit Four: Graphics
• Unit Five: Overall Site Design and Management
• Unit Six: Introduction to Web Authoring Software
• Unit Seven: Culminating Project(s)

---

6. Jim Thatcher on Accessibility: http://www.jimthatcher.com/webcourse1.htm

---

7. CSS and HTML Tutorials on YouTube:

• How to make a very simple web page with html and css: http://www.youtube.com/watch?v=cZYUQsz6rOo
• How to make a web site from scratch css and html: http://www.youtube.com/watch?v=GwQMnpUsj8I
• Basic Html and CSS tutorial - Dreamweaver: http://www.youtube.com/watch?v=ZgP08TUzYvc
• Dreamweaver and CSS: http://www.youtube.com/watch?v=fYYy4AcGICg

8. KompoZer Tutorials
[- if you decide to use KompoZer - it is a little awkward and not as powerful as Dreamweaver.]

9. Window Titles in Dreamweaver:
http://www.youtube.com/watch?v=1Oz-joawijA

10. Embed YouTube Video on your page (and upload to GoDaddy) N E W
www.youtube.com/v/Rof9CL68-sA&feature=youtu.be
[click the full-page icon on the bottom right]

11. Upload your wa1 folder to GoDaddy using the Chrome web browser
https://www.youtube.com/v/JS6LnUuofzQ